<script >
//// 创建表格头部
export default {
  components: {},
  props: {
    allRow: {
      type: Boolean,
      defaule: false
    }
  },
  data() {
    return {
    };
  },
  watch: {

  },
  inject: ["edit"],
  methods: {
    createHead(h) {
      let [tr] = [[]];
      let treeAddIcon = h('img', { attrs: { src: 'statics/icons/table/iconadd2.svg' }, style: { width: '12px', margin: '10px' }  }, []);
      let treeSpreadIcon = h('img', { attrs: { src: 'statics/icons/table/iconspread2.svg' }, style: { width: '12px', margin: '10px' } }, []);
      this.edit.resetNewRowHead.forEach((x) => {
        let cell = [];
        x.forEach((y) => {
          if (y) {
            let width = y.colSpan * 32;
            let subIcon = h('img', { attrs: { src: y.iconPath  } }, []);
            let tmpClass =  ((y.colSpan === 1 && y.rowSpan === 1 ) || y.rowSpan > 1) ? 'verticalRow' : 'horizontalRow rowCell';

            let atooltip =  h('span', {  }, y.displayTitle);
            let subwidth = 'width:' + (width - 1) + 'px';

            let subCell = y.children.length > 0 ? h('div', { class: tmpClass, style: subwidth }, [treeSpreadIcon, atooltip]) : h('div', { class: tmpClass, style: subwidth }, [subIcon, atooltip]);
            if (this.edit.treeToggleRow[y.id]){
              tmpClass = 'verticalRow rowCell';
              subCell =  h('div', { class: tmpClass, style: subwidth }, [treeAddIcon, atooltip]);
            }

            cell.push(h('th', { style: 'width:' + width + 'px', attrs: { colspan: y.colSpan, rowspan: y.rowSpan, 'data-key': y.id, 'data-type': 'row', 'valign': 'top' }

            }, [subCell]));
          }
        });
        tr.push(h('tr', {}, [cell]));
      });
      return tr;
    },

  },
  render(h) {
    let tr = this.createHead(h);
    return h('table', { 'class': {
      editTableBlock: true,
      headtable: true
    }, attrs: {
      style: 'table-layout:fixed;overflow:auto;z-index:0;'
    } }, [h('thead', {}, [tr])]);
  }
};
</script>
